<template>
	<div class="app-control-grid__column--filter">
		<slot :handleComponentAction="handleComponentAction" :value="value"></slot>
	</div>
</template>
<script setup lang="ts">
import { IParam, IEvent } from '@/core';
const emit = defineEmits<{
	(name: 'component-action', value: IEvent<string>): void;
}>();

const value = ref<string>('');

const handleComponentAction = ({ name, action, data }: IEvent<string>) => {
	switch (action) {
		case 'valueChange':
			handleValueChange(name, data);
			break;
	}
};

const handleValueChange = (name: string, data: any) => {
	value.value = data;
	emit('component-action', { name, action: 'column-filter-change', data });
};
</script>
